﻿    @model GUI.Models.ArticleModel

@{
    ViewBag.Title = "Create";

    Layout = "~/Views/Shared/_Layout.cshtml";
   
}


<style>


  .tblarticle, td, th {
   
     padding: 15px;
     background-color:#F8F8F8;
     
}

   input[type="file"] {
  background-color:white; 
  font:bold 14px Arial, Helvetica, sans-serif; 
  color:#3287C8; 
  border:thick; 
  cursor:pointer; 
}


</style>

<link href="~/Content/jquery-ui/jquery-uidatepicker.css" rel="stylesheet" />

<script src="@Url.Content("~/Scripts/jquery-1.8.2.js")"></script>
<script src="~/Scripts/jquery-ui-1.8.20.min.js"></script>

<script type="text/javascript">

 
  
</script>



@using (Html.BeginForm("Create", "Articles", FormMethod.Post, new { @enctype = "multipart/form-data", id = "profilepicture" }))
{
    @Html.ValidationSummary(true)
<table class="tblarticle">
    <caption> <div class="">
    


           
        </div></caption>
    <tr>
        <td> @Html.ListBox("ThemeList", ViewBag.ThemeList as MultiSelectList,
                   new { @class = "chzn-select", data_placeholder = "Choose Themes...", style = "width:350px;" })</td>
       <td>  @Html.EditorFor(model => model.LabelDateCreation)</td>
         <td colspan="3" style="position: initial;
    top: -50px;">  @Html.DropDownList("Culture", (ViewBag.language) as SelectList) </td> 
     </tr>
   
    <tr>
        <td class="txttile"colspan="3">   @Html.TextAreaFor(model => model.Title, new { style = "width: 800px;" })</td>
    </tr>
    <tr>
        <td colspan="3">   @Html.EditorFor(model => model.ArticleContenent)</td>
    </tr>
    <tr>
        <td>  <input type="file" name="fileBigSize"  id="myfile" />   </td>
        <td>  <input type="file" name="fileMediumsize"  id="myfile2" /> </td>
        <td> <input type="file" name="fileLittlesize"  id="myfile3" /></td>
    </tr>
    <tr>
        <td>@Html.HiddenFor(model => model.AuteurId) </td>
            
    </tr>
    <tr>
        <td>  <input type="submit" id="valiarticle" value="Submit" /></td>
    </tr>

</table>

}

@*@using (Html.BeginForm("Create", "Articles", FormMethod.Post, new { @enctype = "multipart/form-data", id = "profilepicture" }))
{
    @Html.ValidationSummary(true)

    @*<div id="flip">المواضيع</div>
    <div id="panel">*@
     
       
          

       @*   <table>
        <tr>
           
            @for (int i = 0; i < ViewBag.Theme.Count; i++)
             {
         <td>     <input type="checkbox" value="@ViewBag.Theme[i].Id" name="listTheme"/>@ViewBag.Theme[i].Subjects </td>
             }
           
                
          
        </tr>
    </table>*@
       
    @* </div>*@
    @*<fieldset>*@
      
       

          @* <div class="control-group">
              <label class="control-label">Multiple Select input</label>
              <div class="controls">
                <select multiple >

                        @for (int i = 0; i < ViewBag.Theme.Count; i++)
                        {
                     <option> @ViewBag.Theme[i].Subjects</option>

                        }
                 
                    </select>
              </div>
            </div>
      *@

     
@*        <legend></legend>

       <div class="">
            @Html.ListBox("ThemeList", ViewBag.ThemeList as MultiSelectList,
                   new { @class = "chzn-select", data_placeholder = "Choose Themes...", style = "width:350px;" })
        </div>
  
        <div>
          @Html.DisplayFor(m => m.Culture)
        </div>
        <div>
         @Html.DropDownList("Culture", (ViewBag.language) as SelectList)
            </div>
       <div class="editor-label">
            @Html.Label("Date")
        </div>
      
      
       <div class="editor-field">
            @Html.EditorFor(model => model.LabelDateCreation)
         
        </div>

     
       <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
     
        
       <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

   
      <div class="editor-label">
            @Html.LabelFor(model => model.ArticleContenent)
        </div>
      
      <div class="editor-field">
            @Html.EditorFor(model => model.ArticleContenent)
            @Html.ValidationMessageFor(model => model.ArticleContenent)
        </div>


      <table style="border: 1px solid groove;width:60%">
          <tr>
              <td>   <label class="filebutton">
      <img src ="../Images/photoart.png" style="width:50px;height:65px" />
     <span>    
            <input type="file" name="fileBigSize"  id="myfile" />  
         </span>
         </label></td> 
              
              
              <td> <label class="filebutton">
               <img src ="../Images/photoart.png" style="width:65px;height:75px" />
       <span>  <input type="file" name="fileMediumsize"  id="myfile2" />  </span>
      </label></td> 
              
           
              <td><label class="filebutton">
                <img src ="../Images/photoart.png" style="width:85px;height:95px" />
        <span>   <input type="file" name="fileLittlesize"  id="myfile3"/> </span>
              </label> </td>
        
              
                </tr>
      </table>
   
      <div class="editor-field">
            @Html.HiddenFor(model => model.AuteurId)
         
        </div>

        <p>
            <input type="submit" id="valiarticle" value="Submit" />
        </p>
    </fieldset>

}*@



@*<input type="button" value="صورة" onclick="uploadImg()" />


<div >
@using (Html.BeginForm("Upload", "Images", FormMethod.Post, new { @enctype = "multipart/form-data", id = "formupload", name = "formupload", target = "framimg1" }))
{

           <input id="ImageUploaded"  type="file" name="ImageUploaded" style=" visibility:hidden" onchange="aa()" />
}
    </div>
<script type="text/javascript">
    function uploadImg() {
        document.getElementById("ImageUploaded").click();
    }
    function aa()
    { alert("eee"); $("#formupload").submit(); }
    function ImageUploaded() {
        alert("ok");
        // $("#formupload").submit();

    }
</script>
<iframe id="framimg1" name="framimg1" style="display:none; width:1px; height:1px"></iframe>
 *@
@*<script>
    $(document).ready(function () {
        $("#flip").click(function () {
            $("#panel").slideToggle("slow");
        });
    });





</script>*@
<script>
    $(function () {
        $(LabelDateCreation).datepicker();
    });
  </script>


<script src="@Url.Content("~/Content/chosen/chosen.jquery.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/Chosen/chosen.min.css")" rel="stylesheet"  type="text/css" />
<script> $(".chzn-select").chosen(); </script>
@section Scripts {
  


}
